<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:p="http://primefaces.org/ui"
	xmlns:pe="http://primefaces.org/ui/extensions"
	xmlns:ui="http://java.sun.com/jsf/facelets">
<ui:composition template="/templates/templateLayout.xhtml">

	<f:metadata>
		<f:viewParam name="id" value="#{propiedadBean.id}" />
		<f:event type="preRenderView" listener="#{propiedadBean.inicio()}" />
	</f:metadata>

	<ui:define name="centerContent">
		<script type="text/javascript"
			src="http://maps.google.com/maps/api/js?sensor=true"></script>
			
			<h:form>
				<p:panel id="panelCreate" header="#{msgs['form.propiedad.detalle']}" styleClass="title ui-widget-header ui-corner-all"
			style="padding: 8px; font-size: 16px !important; text-align: center;">
					<p:messages  showDetail="true"  closable="true" showSummary="true"/>
					<p:panelGrid id="montos" style="width: 100%;text-align:left">
						<f:facet name="header">
							<p:row>
								<p:column colspan="4">Montos</p:column>
							</p:row>
						</f:facet>
						<p:row>
							<p:column width="20">
								<h:outputLabel for="disponibilidad"
									value="#{msgs['form.disponibilidad']}: " />
							</p:column>
							<p:column colspan="3">
								<h:outputLabel id="disponibilidad"
									value="#{propiedadBean.entity.tipoDisponibilidad}" />
							</p:column>
						</p:row>
						<p:row>
							<p:column>
								<h:outputLabel for="montoalquiler"
									value="#{msgs['form.monto']} #{msgs['form.alquiler']}: " />
							</p:column>
							<p:column>
								<h:outputLabel id="montoalquiler"
									value="#{propiedadBean.entity.montoMinimoAlquiler}">
									<f:convertNumber currencySymbol="$" type="currency"
										maxFractionDigits="0" />
								</h:outputLabel>
							</p:column>
							<p:column>
								<h:outputLabel for="montoventa"
									value="#{msgs['form.monto']} #{msgs['form.venta']}: " />
							</p:column>
							<p:column>
								<h:outputLabel id="montoventa"
									value="#{propiedadBean.entity.montoMinimoVenta}">
									<f:convertNumber currencySymbol="$" type="currency"
										maxFractionDigits="0" />
								</h:outputLabel>
							</p:column>
						</p:row>
					</p:panelGrid>

					<p:spacer />

					<p:panelGrid style="width: 100%;text-align:left">
						<f:facet name="header">
							<p:row>
								<p:column colspan="4">Caracteristicas</p:column>
							</p:row>
						</f:facet>
						<p:row>
							<p:column>
								<h:outputLabel for="tipopropiedad"
									value="#{msgs['form.propiedadTipo']}: " />
							</p:column>
							<p:column>
								<h:outputLabel id="tipopropiedad"
									value="#{propiedadBean.entity.propiedadTipo.descripcion}" />

							</p:column>
							<p:column>
								<h:outputLabel value="#{msgs['form.propiedad.cochera']}: " />
							</p:column>
							<p:column>
								<h:outputLabel value="Si"
									rendered="#{propiedadBean.entity.cochera}" />
								<h:outputLabel value="No"
									rendered="#{!propiedadBean.entity.cochera}" />
							</p:column>
						</p:row>
						<p:row>
							<p:column>
								<h:outputLabel for="snpcanbanios"
									value="#{msgs['form.propiedad.cantbanios']}: " />
							</p:column>
							<p:column>
								<h:outputLabel id="snpcanbanios"
									value="#{propiedadBean.entity.cantBanios}" />
							</p:column>
							<p:column>
								<h:outputLabel for="cantcocina"
									value="#{msgs['form.propiedad.cantcocina']}: " />
							</p:column>
							<p:column>
								<h:outputLabel id="cantcocina"
									value="#{propiedadBean.entity.cantCocinas}" />
							</p:column>
						</p:row>
						<p:row>
							<p:column>
								<h:outputLabel for="cantdormitorio"
									value="#{msgs['form.propiedad.cantdormitorio']}: " />
							</p:column>
							<p:column>
								<h:outputLabel id="cantdormitorio"
									value="#{propiedadBean.entity.cantDormitorios}" />
							</p:column>
							<p:column>
								<h:outputLabel for="cantLiving"
									value="#{msgs['form.propiedad.cantLiving']}: " />
							</p:column>
							<p:column>
								<h:outputLabel id="cantLiving"
									value="#{propiedadBean.entity.cantLiving}" />

							</p:column>
						</p:row>
						<p:row>
							<p:column>
								<h:outputLabel for="cantToilette"
									value="#{msgs['form.propiedad.cantToilette']}: " />
							</p:column>
							<p:column>
								<h:outputLabel id="cantToilette"
									value="#{propiedadBean.entity.cantToilette}" />

							</p:column>
							<p:column>
								<h:outputLabel for="cantLocalComercial"
									value="#{msgs['form.propiedad.cantLocalComercial']}: " />
							</p:column>
							<p:column>
								<h:outputLabel id="cantLocalComercial"
									value="#{propiedadBean.entity.cantLocalComercial}" />
							</p:column>
						</p:row>

					</p:panelGrid>

					<p:spacer />

					<p:panelGrid columns="1" style="width: 100%;text-align:left;">
						<f:facet name="header">Propietario</f:facet>
						<h:outputLabel
							value="#{msgs['form.apellidoNombre']}: #{propiedadBean.entity.propietario.apellidoNombre()}" />

					</p:panelGrid>

					<p:spacer />

					<p:panelGrid id="formDireccionBarrio"
						style="width: 100%;text-align:left;">
						<f:facet name="header">
							<p:row>
								<p:column colspan="5">#{msgs['form.direccionubicacion']}</p:column>
							</p:row>
						</f:facet>
						<p:row>
							<p:column>
								<h:outputLabel for="direccion"
									value="#{msgs['form.direccion']}: " />
							</p:column>
							<p:column colspan="2">
								<h:outputLabel id="direccion" size="50"
									value="#{propiedadBean.entity.direccion}" />
							</p:column>
							<p:column rowspan="4">
								<p:gmap id="gmap" center="#{propiedadBean.entity.coordenada.lat},#{propiedadBean.entity.coordenada.lng}"
									zoom="13" type="MAP" style="width:500px;height:350px"
									model="#{propiedadBean.mapaModel}" widgetVar="map">
								</p:gmap>

							</p:column>	
						</p:row>
						<p:row>
							<p:column>
								<h:outputLabel for="numero"
									value="#{msgs['form.numero']}: " />
								<h:outputLabel id="numero"
									value="#{propiedadBean.entity.numero}" />
							</p:column>
							<p:column>
								<h:outputLabel for="depto"
									value="#{msgs['form.depto']}: " />
								<h:outputLabel id="depto" value="#{propiedadBean.entity.dpto}" />

							</p:column>
							<p:column>
								<h:outputLabel for="piso"
									value="#{msgs['form.piso']}: " />
								<h:outputLabel id="piso" value="#{propiedadBean.entity.piso}" />

							</p:column>
						</p:row>
						<p:row>
							<p:column >
								<h:outputLabel for="barrio"
									value="#{msgs['form.ciudad']}: " />
								<h:outputLabel id="ciudad"
									value="#{propiedadBean.entity.barrio.ciudad.descripcion}" size="50" />
							</p:column>
							<p:column>
								<h:outputLabel for="barrio"
									value="#{msgs['form.barrio']}: " />
								<h:outputLabel id="barrio"
									value="#{propiedadBean.entity.barrio.descripcion}" size="50" />
								
							</p:column>
							<p:column >
								<h:outputLabel for="zona" value="#{msgs['form.zona']}: " />
								<h:outputLabel id="zona"
									value="#{propiedadBean.entity.barrio.zona}" size="50" />
							</p:column>
							
						</p:row>
						<p:row>
							<p:column colspan="3">
							</p:column>
						</p:row>

						<f:facet name="footer">
							<p:row>
								<p:column colspan="4">
									<ui:include src="/templates/toolbarView.xhtml" />
								</p:column>
							</p:row>
						</f:facet>
					</p:panelGrid>
				</p:panel>
			</h:form>
		
		
		<script type="text/javascript">
				var currentMarker = null;
				
				function addCurrentMarker(){
					map.addOverlay(currentMarker);

					
				}
				
				
			
				$(document).ready(function() {
					if (#{propiedadBean.entity.marcada()}){
						var home = new google.maps.LatLng(#{propiedadBean.entity.coordenada.lat},
								#{propiedadBean.entity.coordenada.lng});
						currentMarker = new google.maps.Marker({
							position : home,
							icon : "#{request.contextPath}/resources/images/gmap-icon-disponible.png"
							});
						
						map.getMap().setCenter(home);
						addCurrentMarker();
					}
				});
				
				
			</script>
		
		
	</ui:define>
</ui:composition>
</html>

